<div class="limiter">
  <div class="container-login100">
    <div class="loading-shade" *ngIf="isLoading">
      <mat-spinner></mat-spinner>
    </div>
    <form [formGroup]="loginFormGroup" (submit)="onLoginSubmit()" class="login100-form validate-form">
      <div class="row">
        <div class="col-md-12 col-sm-12 col-12" style="text-align: center;">
          <span class="material-icons" style="color: #3f51b5;font-size: 70px;">cloud_download</span>
        </div>
        <!-- <img src="../../assets/images/logo.png" alt="Logo" style="width: 100px;"> -->
      </div>
      <div class="row">
        <div class="col-md-12 col-sm-12 col-12">
          <div class="form-group ">
            <label>
              邮箱
            </label>
            <input formControlName="userName" class="form-control" type="text">
            <div *ngIf="loginFormGroup.get('userName').touched && loginFormGroup.get('userName').errors"
              class="k-tooltip-validation">
              <div class="text-danger" *ngIf="loginFormGroup.get('userName').errors?.required">
                邮箱不能为空.
              </div>
              <div class="text-danger" *ngIf="loginFormGroup.get('userName').errors?.email">
                Please enter valid email
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-12 col-sm-12 col-12">
          <div class="form-group">
            <label>
              密码
            </label>
            <div class="input-group">
              <input formControlName="password" class="form-control" [type]="fieldTextType ? 'text' : 'password'">
              <div class="input-group-append">
                <span class="input-group-text cursor-pointer">
                  <i class="fa" [ngClass]="{'fa-eye-slash':!fieldTextType,'fa-eye': fieldTextType}"
                    (click)="fieldTextType=!fieldTextType"></i>
                </span>
              </div>
            </div>
            <div *ngIf="loginFormGroup.get('password').touched && loginFormGroup.get('password').errors?.required"
              class="k-tooltip-validation">
              <div class="text-danger" *ngIf="loginFormGroup.get('password').errors?.required">
                密码不能为空
              </div>
            </div>
          </div>
        </div>
        <div class="col-md-12 col-sm-6 col-12">
          <button type="submit" class="btn-main-large" [disabled]="!loginFormGroup.valid">
            登录
          </button>
        </div>
      </div>
    </form>
  </div>
</div>
